


    import * as React from 'react';
    import * as ReactDOM from 'react-dom';

    var FixTable = require("../../components/table/FixTable.js");

    var Table = React.createClass({
        getDefaultProps: function () {
            return {
                list: [
                    {
                        "name": "坑你",
                        "typeDisplayName": "电话费",
                        "remark": "备注001",
                        "name01": "20150505",
                        "supplierStepDisplayName": "的说法",
                        "id": "10001"
                    },
                    {
                        "name": "坑你",
                        "typeDisplayName": "电话费",
                        "remark": "备注001",
                        "name01": "20150505",
                        "supplierStepDisplayName": "的说法",
                        "id": "10001"
                    },
                    {
                        "name": "坑你",
                        "typeDisplayName": "电话费",
                        "remark": "备注001",
                        "name01": "20150505",
                        "supplierStepDisplayName": "的说法",
                        "id": "10001"
                    },
                    {"name": "坑你", "typeDisplayName": "电话费", "remark": "备注001", "name01": "20150505", "supplierStepDisplayName": "的说法", "id": "10001"}
                ],
                param: [
                    {"prop": "name", "title": "供应商名称"},
                    {"prop": "typeDisplayName", "title": "供应商类型"},
                    {"prop": "remark", "title": "备注"},
                    {"prop": "name01", "title": "创建时间"},
                    {"prop": "supplierStepDisplayName", "title": "状态"},
                    {"prop": "supplierStepDisplayName", "title": "操作", "dd": true}
                ]

            };
        },
        componentDidMount: function () {
            //FixTable("ddd",2,1300,600)//TableID, FixColumnNumber, width, height
        },
        render: function () {
            var Do = this.props.DoSth;
            var $head = [], key, $colum = [], i = 0, j = 0;
    
            if(this.props.list instanceof Array){
                 for (; j < this.props.param.length; j++) {
                    $head.push(<Th key={j} param={this.props.param[j]}/>);
                }
                for (; i < this.props.list.length; i++) {
                    $colum.push(
                        <Column key={i} order={this.props.param} param={this.props.list[i]}>
                            <Do
                                toDetail={this.props && this.props.toDetail || null}
                                toEdit={this.props.toEdit} order={this.props.param}
                                toDelete={this.props && this.props.toDelete || null}
                                toDelivery={this.props && this.props.toDelivery || null}
                                toCheck={this.props && this.props.toCheck || null}
                                toApplyPay={this.props && this.props.toApplyPay || null}
                                toConfirmPay={this.props && this.props.toConfirmPay || null}
                                param={this.props.list[i]}
                            />
                        </Column>
                    );
                }
                return (
                    <div className="container-table-info">
                        <div className="table">
                            <div className="temp">
                                <table id="ddd">
                                    <thead>
                                    <tr>
                                        {$head}
                                    </tr>
                                    </thead>
                                    <tbody>
                                    {$colum}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                )
            }else{
                return (
                    <div className="container-table-info">
                    loading
                    </div>
                )                
               
            }  
            
            
        }
    });


    var Th = React.createClass({
        render: function () {
            return (
                <th>{this.props.param.title}</th>
            )
        }
    })

    var Column = React.createClass({
        render: function () {
            var param = this.props.param, $cell = [], i = 0, temp;
            this.props.children.dd = "fuck"
            return (
                <tr>
                    {(() => {
                        for (; i < this.props.order.length; i++) {
                            temp = this.props.order[i]["prop"];
                          /*  console.info(temp);*/
                            if (this.props.order[i]["dd"]) {
                                $cell.push(<td key={i}>{this.props.children}</td>)
                            } else {
                                $cell.push(<Cell param={param[temp]} key={i}></Cell>)
                            }
                        }
                        return (
                            $cell
                        )
                    })()}
                </tr>
            )
        }
    })

    var Columns = React.createClass({
        render: function () {
            var param = this.props.param, $cell = [], i = 0, temp;
            var dd = this.props.children
            // //console.log("555***********"+JSON.stringify(param))
            ////console.log("order***********"+JSON.stringify(this.props.order))
            for (; i < this.props.order.length; i++) {
                temp = this.props.order[i]["prop"];
                ////console.log(this.props.order[i]["dd"]);
                if (this.props.order[i]["dd"]) {
                    //console.log("*************************************")
                    //console.log(dd)
                    $cell.push(<Cell param={param[temp]} key={i}>
                        {
                            React.Children.map(this.props.children, function (child) {
                                return {child};
                            })
                        }
                    </Cell>)
                } else {
                    $cell.push(<Cell param={param[temp]} key={i}></Cell>)
                }

            }
            /*for(var key in param){
             $cell.push(<Cell param={param[]}></Cell>)
             }*/
            return (
                <tr>
                    {$cell}
                </tr>
            )
        }
    })

    var Cell = React.createClass({
        render: function () {
            return (
                <td>{this.props.param}
                    {
                        React.Children.map(this.props.children, function (child) {
                            return {child};
                        })
                    }
                </td>
            )
        }
    })


    module.exports =  Table;

/*

 {
 React.Children.map(this.props.order, function (order) {
 <Cell param={param[order.prop]}/>
 })


 }

 */
/*
 "head":{"prop":"name","title":"供应商名称"},
 "center":[
 {"prop":"typeDisplayName","title":"供应商类型"},
 {"prop":"remark","title":"备注"},
 {"prop":"name","title":"创建时间"},
 {"prop":"supplierStepDisplayName","title":"状态"}
 ],
 "last":[
 {"prop":"id","title":"编辑","doMethod":""},
 {"prop":"id","title":"查看","doMethod":""},
 {"prop":"id","title":"停用","doMethod":""},
 ]

 */

/*<div className="container-table-info">
 <div className="table-head">
 <ul>
 <li>序号</li>
 <li>dsfsd</li>
 <li>序的非官方的号</li>
 <li>dsfsd</li>
 <li>序的非官方的号</li>
 </ul>
 </div>
 <div className="table">
 <div className="temp">
 <table>
 <thead>
 <tr>
 <th>序号</th>
 <th>创建时间</th>
 <th>生产专员</th>
 <th>物业编号</th>
 <th>项目名称</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>123</td>
 <td>1235555555555555</td>
 <td>123</td>
 <td>123</td>
 <td>123</td>
 </tr>
 <tr>
 <td>123</td>
 <td>123</td>
 <td>123111111111111</td>
 <td>123</td>
 <td>123</td>
 </tr>
 <tr>
 <td>123ffffffffffffffff</td>
 <td>123</td>
 <td>123</td>
 <td>123</td>
 <td>123</td>
 </tr>
 <tr>
 <td>123</td>
 <td>123bbbbbbbbbbbb</td>
 <td>123</td>
 <td>123</td>
 <td>123</td>
 </tr>
 </tbody>
 </table>
 </div>
 </div>
 <div className="table-last">
 <ul>
 <li>操作</li>
 <li>dsfsd</li>
 <li>序的非官方的号</li>
 <li>dsfsd</li>
 <li>序的非官方的号</li>
 </ul>
 </div>
 </div>      */
